<html>

<head>

<style type="text/css">

table
{
	position:relative;
	left:25%;
}
table.registracija
{
	left:40%;
}
table.proizvodi
{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	left:0%;
	width:95%;
	border-collapse:collapse;
}
table.unosPodataka
{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	width:40%;
	border-collapse:collapse;
	border:0;
}
table.proizvodi td, table.proizvodi th 
{
	font-size:1em;
	border:1px solid #98bf21;
	padding:3px 7px 2px 7px;
}
table.proizvodi th 
{
	font-size:1.1em;
	text-align:left;
	padding-top:5px;
	padding-bottom:4px;
	background-color:#A7C942;
	color:#ffffff;
}
table.proizvodi tr.alt td 
{
	color:#000000;
	background-color:#EAF2D3;
}

button
{
	font-size:1em;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	border:1px solid #98bf21;
	text-align:center;
}
button:hover
{
    background:gray;
    box-shadow: 0px 0px 1px #777;
}
button.dugmeTabela
{
	height:80;
	width:120;
}

div
{
	position:relative;
}
div.jsonPodaci
{
	position:absolute;
	left:10%;
	top:90%;
	width:80%;
	height:10%;
}
div.banner
{
	overflow:auto;
	left:15%;
	width:70%;
	height:150px;
	background-color:#EAF2D3;
}

div.login
{
	float:right;
	width:250px;
	height:80px;
}
div.korpa
{
	float:right;
	width:22%;
	height:60%;
}
div.logo
{
	float:left;
	padding-top:5px;
	padding-bottom:4px;
	padding-left:5px;
	padding-rigth:4px;
}
div.scrollovanje
{
	left:25%;
	width:50%;
	height:200px;
	overflow-y:scroll;
}


</style>

<script type='text/javascript'>

var ulogovanKorisnik;
var korpa;

//DEO KOJI KOMUNICIRA SA SERVEROM

function logIn()
{
	if(proveri(document.getElementById("korisnickoImeLog").value,"korisnickoImeLog") && proveri(document.getElementById("sifraLog").value,"sifraLog"))
	{
		var poruka="/api/rad/logIn/"+document.getElementById("korisnickoImeLog").value+"/"+document.getElementById("sifraLog").value;
		document.getElementById("leviJson").innerHTML=poruka;
		var xhr = new XMLHttpRequest();
		xhr.onreadystatechange = function() {
			document.getElementById("desniJson").innerHTML=xhr.responseText;
				if (xhr.readyState == 4) {
					ulogovanKorisnik=JSON.parse( xhr.responseText );
					ulogovan();
				}
		}
		xhr.open('GET', poruka, true);
		xhr.send();
	}
}

function promeniProizvodAkcija()
{
	if(proveri(document.getElementById("nazivProizvoda").value,"nazivProizvoda") && proveri(document.getElementById("opisProizvoda").value,"opisProizvoda") && proveri(document.getElementById("cenaProizvoda").value,"cenaProizvoda"))
	{
		if(ulogovanKorisnik!=null && ulogovanKorisnik.koisnickoIme!=null && ulogovanKorisnik.koisnickoIme!="")
		{
			var poruka="/api/radProizvodi/promeniProizvod/"+document.getElementById("nazivProizvoda").value+"/"+document.getElementById("opisProizvoda").value+"/"+document.getElementById("cenaProizvoda").value;
			document.getElementById("leviJson").innerHTML=poruka;
			var xhr = new XMLHttpRequest();
			xhr.onreadystatechange = function() {
				document.getElementById("desniJson").innerHTML=xhr.responseText;
					if (xhr.readyState == 4) {
						osveziProdavceveProizvode();
					}
			}
			xhr.open('POST', poruka, true);
			xhr.send();
		}
		else
			alert("Niste ulogovani kao prodavac!")
	}
}

function izbrisiProizvodAkcija(e)
{
	if(ulogovanKorisnik!=null && ulogovanKorisnik.koisnickoIme!=null && ulogovanKorisnik.koisnickoIme!="")
	{
		var poruka="/api/radProizvodi/izbrisiProizvod/"+this.proizvod.naziv;
		document.getElementById("leviJson").innerHTML=poruka;
		
		var tabelaProizvoda=document.getElementById("tabelaProdavcevihProizvoda");
    	var pom=tabelaProizvoda.getElementsByTagName("button");
    	for(var i=0;i<pom.length;i++)
    	{
    		if(pom[i].red==this.red)
    			tabelaProizvoda.deleteRow(i);
    	}
    	
		var xhr = new XMLHttpRequest();
		xhr.onreadystatechange = function() {
			document.getElementById("desniJson").innerHTML=xhr.responseText;
			    if (xhr.readyState == 4) {
			    	//osveziProdavceveProizvode();
			    }
		}
		xhr.open('DELETE', poruka, true);
		xhr.send();
	}
	else
		alert("Niste ulogovani kao prodavac!")
}


function registracijaKupca()
{
	if(proveri(document.getElementById("korisnickoIme").value,"korisnickoIme") && proveri(document.getElementById("korisnickaSifra").value,"korisnickaSifra") && proveri(document.getElementById("korisnickaAdresa").value,"korisnickaAdresa"))
	{
		var poruka="/api/rad/registrujKupca/"+document.getElementById("korisnickoIme").value+"/"+document.getElementById("korisnickaSifra").value+"/"+document.getElementById("korisnickaAdresa").value;
		document.getElementById("leviJson").innerHTML=poruka;
		var xhr = new XMLHttpRequest();
		xhr.onreadystatechange = function() {
			document.getElementById("desniJson").innerHTML=xhr.responseText;
				if (xhr.readyState == 4) {
					ulogovanKorisnik=JSON.parse( xhr.responseText );
					ulogovan();
				}
		}
		xhr.open('GET', poruka, true);
		xhr.send();
	}
}

function registracijaProdavca()
{
	if(proveri(document.getElementById("korisnickoIme").value,"korisnickoIme") && proveri(document.getElementById("korisnickaSifra").value,"korisnickaSifra") && proveri(document.getElementById("korisnickaAdresa").value,"korisnickaAdresa"))
	{
		var poruka="/api/rad/registrujProdavca/"+document.getElementById("korisnickoIme").value+"/"+document.getElementById("korisnickaSifra").value+"/"+document.getElementById("korisnickaAdresa").value;
		document.getElementById("leviJson").innerHTML=poruka;
		var xhr = new XMLHttpRequest();
		xhr.onreadystatechange = function() {
			document.getElementById("desniJson").innerHTML=xhr.responseText;
				if (xhr.readyState == 4) {
					ulogovanKorisnik=JSON.parse( xhr.responseText );
					ulogovan();
				}
		}
		xhr.open('GET', poruka, true);
		xhr.send();
	}
}

function vratiKorisnike()
{
	var poruka="/api/rad/vratiKorisnike";
	document.getElementById("leviJson").innerHTML=poruka;
	var dobio;
	var xhr = new XMLHttpRequest();
	xhr.onreadystatechange = function() {
		document.getElementById("desniJson").innerHTML=xhr.responseText;
		    if (xhr.readyState == 4) {
		      	dobio=JSON.parse( xhr.responseText );
		      	popuniTabeluKorisnika(dobio);
		    }
	}
	xhr.open('GET', poruka, true);
	xhr.send();
}

function vratiKupce()
{
	var poruka="/api/rad/vratiKupce";
	document.getElementById("leviJson").innerHTML=poruka;
	var dobio;
	var xhr = new XMLHttpRequest();
	xhr.onreadystatechange = function() {
		document.getElementById("desniJson").innerHTML=xhr.responseText;
		    if (xhr.readyState == 4) {
		      	dobio=JSON.parse( xhr.responseText );
		    }
	}
	xhr.open('GET', poruka, true);
	xhr.send();
}

function vratiProdavce()
{
	var poruka="/api/rad/vratiProdavce";
	document.getElementById("leviJson").innerHTML=poruka;
	var dobio;
	var xhr = new XMLHttpRequest();
	xhr.onreadystatechange = function() {
		document.getElementById("desniJson").innerHTML=xhr.responseText;
		    if (xhr.readyState == 4) {
		      	dobio=JSON.parse( xhr.responseText );
		    }
	}
	xhr.open('GET', poruka, true);
	xhr.send();
}

function dodajProizvod()
{
	if(proveri(document.getElementById("nazivProizvoda").value,"nazivProizvoda") && proveri(document.getElementById("opisProizvoda").value,"opisProizvoda") && proveri(document.getElementById("cenaProizvoda").value,"cenaProizvoda"))
	{
		if(ulogovanKorisnik!=null && ulogovanKorisnik.koisnickoIme!=null && ulogovanKorisnik.koisnickoIme!="")
		{
			var poruka="/api/radProizvodi/dodajProizvod/"+document.getElementById("nazivProizvoda").value+"/"+document.getElementById("opisProizvoda").value+"/"+document.getElementById("cenaProizvoda").value+"/"+ulogovanKorisnik.koisnickoIme;
			document.getElementById("leviJson").innerHTML=poruka;
			var xhr = new XMLHttpRequest();
			xhr.onreadystatechange = function() {
				document.getElementById("desniJson").innerHTML=xhr.responseText;
					if (xhr.readyState == 4) {
						osveziProdavceveProizvode();
					}
			}
			xhr.open('POST', poruka, true);
			xhr.send();
		}
		else
			alert("Niste ulogovani kao prodavac!!!");
	}
}

function vratiProizvode()
{
	var poruka="/api/radProizvodi/vratiProizvode";
	document.getElementById("leviJson").innerHTML=poruka;
	var dobio;
	var xhr = new XMLHttpRequest();
	xhr.onreadystatechange = function() {
		document.getElementById("desniJson").innerHTML=xhr.responseText;
		    if (xhr.readyState == 4) {
		      	dobio=JSON.parse( xhr.responseText );
		      	popuniTableuProizvoda(dobio);
		    }
	}
	xhr.open('GET', poruka, true);
	xhr.send();
}

function registracija()
{
	if(proveri(document.getElementById("korisnickoIme").value,"korisnickoIme") && proveri(document.getElementById("korisnickaSifra").value,"korisnickaSifra") && proveri(document.getElementById("korisnickaAdresa").value,"korisnickaAdresa"))
	{
		var poruka="/api/rad/registruj/"+document.getElementById("korisnickoIme").value+"/"+document.getElementById("korisnickaSifra").value+"/"+document.getElementById("korisnickaAdresa").value+"/"+document.getElementById("selekcija").value;
		var xhr = new XMLHttpRequest();
		document.getElementById("leviJson").innerHTML=poruka;
		xhr.onreadystatechange = function() {
			document.getElementById("desniJson").innerHTML=xhr.responseText;
				if (xhr.readyState == 4) {
					//alert("iii  "+xhr.responseText);
					ulogovanKorisnik=JSON.parse( xhr.responseText );
					ulogovan();
				}
		}
		xhr.open('GET', poruka, true);
		xhr.send();
	}
	else
		alert("Niste uneli sve podatke")
	/*
	if(document.getElementById("selekcija").value=="kupac")
		registracijaKupca();
	else
		registracijaProdavca();*/
}

function posaljiPlacanje(poruka)
{
	var slanje=JSON.stringify({ proizvod: korpa });
	
	var xhr = new XMLHttpRequest();
	document.getElementById("leviJson").innerHTML=poruka;
	xhr.open('POST', poruka, true);
	
	xhr.setRequestHeader("Content-type", "application/json");
	xhr.setRequestHeader("Content-length", slanje.length);
	xhr.setRequestHeader("Connection", "close");
	
	xhr.onreadystatechange = function() {
		document.getElementById("desniJson").innerHTML=xhr.responseText;
		if (xhr.readyState == 4) {
			pocetniKupacPokazi();
			korpa=new Array();
			pom=document.getElementById("brojProizvodaKorpa");
			pom.innerHTML="0";
			pom=document.getElementById("ukupnaCenaKorpa");
			pom.innerHTML="0";
	    }
	}
	xhr.send(slanje);
}

function posaljiPlacanjeDrugiNacin(poruka)
{
	var xhr = new XMLHttpRequest();
	document.getElementById("leviJson").innerHTML=poruka;
	xhr.open('POST', poruka, true);
	
	xhr.onreadystatechange = function() {
		document.getElementById("desniJson").innerHTML=xhr.responseText;
		if (xhr.readyState == 4) {
			pocetniKupacPokazi();
			korpa=new Array();
			pom=document.getElementById("brojProizvodaKorpa");
			pom.innerHTML="0";
			pom=document.getElementById("ukupnaCenaKorpa");
			pom.innerHTML="0";
	    }
	}
	xhr.send();
}

function osveziProdavceveProizvode()
{
	if(ulogovanKorisnik!=null && ulogovanKorisnik.koisnickoIme!=null && ulogovanKorisnik.koisnickoIme!="" && ulogovanKorisnik.korisnickaSifra!=null && ulogovanKorisnik.korisnickaSifra!="")
	{
		var poruka="/api/rad/logIn/"+ulogovanKorisnik.koisnickoIme+"/"+ulogovanKorisnik.korisnickaSifra;
		document.getElementById("leviJson").innerHTML=poruka;
		var xhr = new XMLHttpRequest();
		xhr.onreadystatechange = function() {
			document.getElementById("desniJson").innerHTML=xhr.responseText;
				if (xhr.readyState == 4) {
					ulogovanKorisnik=JSON.parse( xhr.responseText );
					ulogovan();
				}
		}
		xhr.open('GET', poruka, true);
		xhr.send();
	}
	else
		alert("Niste ulogovani kao prodavac")
}

function osvezi()
{
	var poruka="/api/radProizvodi/vratiProdavacProizvode";
	document.getElementById("leviJson").innerHTML=poruka;
	var dobio;
	var xhr = new XMLHttpRequest();
	xhr.onreadystatechange = function() {
		document.getElementById("desniJson").innerHTML=xhr.responseText;
		    if (xhr.readyState == 4) {
		      	dobio=JSON.parse( xhr.responseText );
		      	popuniTableuProizvoda(dobio);
		    }
	}
	xhr.open('GET', poruka, true);
	xhr.send();
}

//OVDE SE ZAVRSAVA DEO KOJI KOMUNICIRA SA SERVEROM

function proveri(podatak,polje) 
{
	if(podatak == "") 
	{
		alert("Polje "+polje+" ne sme da bude prazno!");
		return false;
	}
	return true;
}

window.onload = function () {
	pocetnoStanje();
	var nesto=${requestScope.proizvodnaPomagala};
	document.getElementById("pomoc").innerHTML="Na gornjoj desnoj strani imamo dva textboxa i dva dugmeta (Uloguj se i Registruj se)\n\n"+
	"za logovanje sam vec napravio par korisnika preko kojih se moze ulogovati\n\n"+
	"ako zelimo da se ulogujemo kao kupac korisnicko ime je: Milos   a sifra je: 123\n\n"+
	"ako zelimo da se ulogujemo kao prodavac korisnicko ime je: Marko   a sifra je: 123\n\n"+
	"ako zelimo da se ulogujemo kao administrator korisnicko ime je: admin  a sifra je: 123\n\n"+
	"kada smo uneli potrebne podatke za logovanje kliknemo na dugme Uloguj se\n\n"+
	"ali ako zelimo da napravimo novog korisnika kliknemo na dugme Registruj se";
	if(nesto!=null)
	{
		var tabelaProizvoda=document.getElementById("tabelaProizvodi");
		
		isprazniTabelu(tabelaProizvoda);
		
		for(var i=0;i<nesto.length;i++)
		{
			ubaciProizvod(tabelaProizvoda,nesto[i],i);	
		}
	}
}

function ulogovan()
{
	if(ulogovanKorisnik!=null)
	{
		if(ulogovanKorisnik.poruka=="Kupac")
		{
			var tabelaProizvodi = document.getElementById("tabelaProizvodi");
			korpa=new Array();
			prikaziSveRedove(tabelaProizvodi);
			pocetniKupacPokazi();
		}
		else if(ulogovanKorisnik.poruka=="Prodavac")
		{
			var tabelaProizvodi = document.getElementById("tabelaProdavcevihProizvoda");
			popuniTabeluProdavcevihProizvoda(tabelaProizvodi);
			pocetniProdavacPokazi();
		}
		else if(ulogovanKorisnik.poruka=="Administrator")
		{
			pocetniAdministratorPokazi();
			vratiKorisnike();
		}
		else
			pocetnoStanje();
	}
	else
		pocetnoStanje();
}

function popuniTabeluProdavcevihProizvoda(tabela)
{
	isprazniTabelu(tabela);
	if(ulogovanKorisnik.proizvod!=null)
	{
		if(ulogovanKorisnik.proizvod.length==null)
			ubaciProdavcevProizvod(tabela,ulogovanKorisnik.proizvod,0);
		else
		{
			for(var i=0;i<ulogovanKorisnik.proizvod.length;i++)
			{
				ubaciProdavcevProizvod(tabela,ulogovanKorisnik.proizvod[i],i);
			}
		}
	}
}

function ubaciProdavcevProizvod(tabela,proizvod,i)
{
	var red=tabela.insertRow();
	var cell1 = red.insertCell(0);
	cell1.innerHTML = proizvod.naziv;
	
	cell1 = red.insertCell(1);
	cell1.innerHTML = proizvod.opis;
	
	cell1 = red.insertCell(2);
	cell1.innerHTML = proizvod.cena;
	
	cell1 = red.insertCell(3);
	var btn=document.createElement("BUTTON");
	btn.proizvod=proizvod;
	btn.onclick=pripremiPromenuProizvoda;
	var t=document.createTextNode("Promeni");
	btn.appendChild(t); 
	cell1.appendChild(btn);
	
	cell1 = red.insertCell(4);
	btn=document.createElement("BUTTON");
	btn.proizvod=proizvod;
	btn.red=i;
	btn.onclick=izbrisiProizvodAkcija;
	t=document.createTextNode("Izbrisi");
	btn.appendChild(t); 
	cell1.appendChild(btn);
	
	if(i%2==0)
		red.className="alt";
}

function pripremiPromenuProizvoda(e)
{
	var pom=document.getElementById("nazivProizvoda");
	pom.value=this.proizvod.naziv;
	pom=document.getElementById("opisProizvoda");
	pom.value=this.proizvod.opis;
	pom=document.getElementById("cenaProizvoda");
	pom.value=this.proizvod.cena;
	izmeniProizvodPokazi();
}


function prikaziSveRedove(tabela)
{
	var th=tabela.getElementsByTagName("th");
	for(var i=0;i<th.length;i+=1)
	{
		th[i].style.display="";
	}
	var td = tabela.getElementsByTagName("td");
	
	for(var i=0;i<td.length;i+=1)
	{
		td[i].style.display="";
	}
}

function popuniTabeluKorisnika(korisnici)
{
	var tabelaKorisnici=document.getElementById("tabelaKorisnici");
	
	isprazniTabelu(tabelaKorisnici);
	
	if(korisnici.korisnik!=null)
	{
		if(korisnici.korisnik.length==null)
			ubaciKorisnika(tabelaKorisnici,korisnici.korisnik,0);
		else
		{
			for(var i=0;i<korisnici.korisnik.length;i++)
			{
				ubaciKorisnika(tabelaKorisnici,korisnici.korisnik[i],i);
			}
		}
	}
}

function ubaciKorisnika(tabela,korisnik,i)
{
	var red=tabela.insertRow();
	var cell1 = red.insertCell(0);
	cell1.innerHTML = korisnik.koisnickoIme;
	
	cell1 = red.insertCell(1);
	cell1.innerHTML = korisnik.adresa;
	
	cell1 = red.insertCell(2);
	cell1.innerHTML = korisnik.poruka;
	
	cell1 = red.insertCell(3);
	btn=document.createElement("BUTTON");
	btn.korisnik=korisnik;
	btn.red=i;
	btn.onclick=izbrisiKorisnikaAkcija;
	t=document.createTextNode("Izbrisi");
	btn.appendChild(t); 
	cell1.appendChild(btn);
	
	if(i%2==0)
		red.className="alt";
}

function izbrisiKorisnikaAkcija(e)
{
	if(ulogovanKorisnik!=null && ulogovanKorisnik.koisnickoIme!=null && ulogovanKorisnik.koisnickoIme!="" && ulogovanKorisnik.poruka=="Administrator")
	{
		var poruka="/api/rad/izbrisiKorisnika/"+this.korisnik.koisnickoIme;
		document.getElementById("leviJson").innerHTML=poruka;
		
		var tabelakorisnika=document.getElementById("tabelaKorisnici");
    	var pom=tabelakorisnika.getElementsByTagName("button");
    	for(var i=0;i<pom.length;i++)
    	{
    		if(pom[i].red==this.red)
    			tabelaProizvoda.deleteRow(i);
    	}
		
		var xhr = new XMLHttpRequest();
		xhr.onreadystatechange = function() {
			document.getElementById("desniJson").innerHTML=xhr.responseText;
			    if (xhr.readyState == 4) {
			    }
		}
		xhr.open('DELETE', poruka, true);
		xhr.send();
	}
	else
		alert("Niste ulogovani kao administrator!")
}

function popuniTableuProizvoda(proizvodi)
{
	var tabelaProizvoda=document.getElementById("tabelaProizvodi");
	
	isprazniTabelu(tabelaProizvoda);
	
	if(proizvodi.proizvod!=null)
	{
		if(proizvodi.proizvod.length==null)
			ubaciProizvod(tabelaProizvoda,proizvodi.proizvod,0);
		else
		{
			for(var i=0;i<proizvodi.proizvod.length;i++)
			{
				ubaciProizvod(tabelaProizvoda,proizvodi.proizvod[i],i);
			}
		}
	}
}

function popuniTableuKorpeProizvoda()
{
	var tabelaProizvoda=document.getElementById("tabelaKasaProizvoda");
	isprazniTabelu(tabelaProizvoda);
	
	if(korpa!=null)
	{
		var korpaNova=napaviNovuKorpu();
		var brojProizvoda=0;
		var ukCenaProizvoda=0;
		
		for(var i=0;i<korpaNova.length;i++)
		{
			var red=tabelaProizvoda.insertRow();
			
			var cell1 = red.insertCell(0);
			cell1.innerHTML = i;
			cell1.style.display="none";
			
			var cell1 = red.insertCell(1);
			cell1.innerHTML = korpaNova[i].naziv;
			
			cell1 = red.insertCell(2);
			cell1.innerHTML = korpaNova[i].opis;
			
			cell1 = red.insertCell(3);
			cell1.innerHTML = korpaNova[i].cena;
			
			cell1 = red.insertCell(4);
			cell1.innerHTML = korpaNova[i].broj;
			
			cell1 = red.insertCell(5);
			cell1.innerHTML = korpaNova[i].ukCena;
			
			cell1 = red.insertCell(6);
			var btn=document.createElement("BUTTON");
			btn.naziv=korpaNova[i].naziv;
			btn.onclick=izbaciProizvodKorpe;
			var t=document.createTextNode("Izbaci");
			btn.appendChild(t); 
			cell1.appendChild(btn);
			
			brojProizvoda+=korpaNova[i].broj;
			
			ukCenaProizvoda+=parseInt(korpaNova[i].ukCena);
			
			if(i%2==0)
				red.className="alt";
		}
		
		if(brojProizvoda>0)
		{
			var red=tabelaProizvoda.insertRow();
			red.insertCell(0);
			
			red=tabelaProizvoda.insertRow();
			red.insertCell(0);
			red.insertCell(1);
			red.insertCell(2);
			var cell1=red.insertCell(3);
			cell1.innerHTML ="Ukupan broj proizvoda:"+brojProizvoda;
			cell1=red.insertCell(4);
			cell1.innerHTML ="Ukupna cena proizvoda:"+ukCenaProizvoda;
			cell1=red.insertCell(5);
			document.getElementById("zavrsnoPlacanjeDugme").style.display="";
		}
		else
			document.getElementById("zavrsnoPlacanjeDugme").style.display="none";
	}
	kasaDeoPokazi();
}

function napaviNovuKorpu()
{
	var korpaNova=new Array();

	for(var i=0;i<korpa.length;i++)
	{	
		dodajNovaKorpa(korpaNova,korpa[i]);
	}
	return korpaNova;
}

function dodajNovaKorpa(korpaNova,proizvod)
{
	var i=0;
	for(i=0;i<korpaNova.length;i++)
	{
		if(korpaNova[i].naziv==proizvod.naziv)
		{
			korpaNova[i].broj++;
			korpaNova[i].ukCena=korpaNova[i].broj*korpaNova[i].cena;
			break;
		}
	}
	
	if(i==korpaNova.length)
	{
		korpaNova[i]=new Object();
		korpaNova[i].naziv=proizvod.naziv;
		korpaNova[i].opis=proizvod.opis;
		korpaNova[i].cena=proizvod.cena;
		korpaNova[i].broj=1;
		korpaNova[i].ukCena=proizvod.cena;
	}
}

function izbaciProizvodKorpe()
{
	/*var tabelaProizvoda=document.getElementById("tabelaKasaProizvoda");
	tabelaProizvoda.deleteRow(this.proizvod+1);*/
	for(var i=0;i<korpa.length;i++)
	{
		if(korpa[i].naziv==this.naziv)
		{
			korpa.splice(i,1);
			break;
		}
	}
	
	popuniTableuKorpeProizvoda();
	
	/*var pom=tabelaProizvoda.getElementsByTagName("button");
	for(var i=0;i<pom.length;i++)
	{
		pom[i].proizvod=i;
	}*/
}

function ubaciProizvod(tabela,proizvod,i)
{
	var red=tabela.insertRow();
	var cell1 = red.insertCell(0);
	cell1.innerHTML = proizvod.naziv;
	
	cell1 = red.insertCell(1);
	cell1.innerHTML = proizvod.opis;
	
	cell1 = red.insertCell(2);
	cell1.innerHTML = proizvod.cena;
	
	cell1 = red.insertCell(3);
	var btn=document.createElement("BUTTON");
	btn.proizvod=proizvod;
	btn.onclick=dodajKorpu;
	var t=document.createTextNode("Dodaj u korpu");
	btn.appendChild(t); 
	cell1.appendChild(btn);
	
	if(ulogovanKorisnik==null || tabela.id=="tabelaPlacenihProizvoda")
		cell1.style.display="none";
	
	if(i%2==0)
		red.className="alt";
}

function dodajKorpu()
{
	korpa[korpa.length]=this.proizvod;
	var pom=document.getElementById("ukupnaCenaKorpa");
	pom.innerHTML =sracunajUkupnuCenu();
	pom=document.getElementById("brojProizvodaKorpa");
	pom.innerHTML =korpa.length;
}

function sracunajUkupnuCenu()
{
	var ukCena=0;
	for(var i=0;i<korpa.length;i++)
	{
		ukCena+=Number(korpa[i].cena);
	}
	return ukCena;
}

function isprazniTabelu(tabelaProizvoda)
{
	for(var i = tabelaProizvoda.rows.length -1 ; i > 0; i--)
	{
		tabelaProizvoda.deleteRow(i);
	}
}

function izaberiPlacanje()
{
	var pomTabela=document.getElementById("izaberiNacinPlacanja");
	if(pomTabela.value=="kreditnoPlacanje")
	{
		document.getElementById("kreditnoPlacanje").style.display="";
		document.getElementById("cekovnoPlacanje").style.display="none";
	}
	else if(pomTabela.value=="cekovnoPlacanje")
	{
		document.getElementById("kreditnoPlacanje").style.display="none";
		document.getElementById("cekovnoPlacanje").style.display="";
	}
}

function zavrsiPlacanje()
{
	if(korpa!=null && korpa.length>0)
	{
		var poruka="";
		var pomTabela=document.getElementById("izaberiNacinPlacanja");
		if(pomTabela.value=="kreditnoPlacanje")
			poruka="/api/radProizvodi/kreditnoPlacanje/"+ulogovanKorisnik.koisnickoIme+"/"+document.getElementById("brojRacuna").value+"/"+document.getElementById("tipRacuna").value;
		else
			poruka="/api/radProizvodi/cekovnoPlacanje/"+ulogovanKorisnik.koisnickoIme+"/"+document.getElementById("imeBanke").value+"/"+document.getElementById("brojBanke").value;
		posaljiPlacanje(poruka);
	}
	else
		alert("Niste izabrali proizvode za kupovinu!");
}

function zavrsiPlacanjeDrugiNacin()
{
	if(korpa!=null && korpa.length>0)
	{
		var poruka="/api/radProizvodi/placanje/proizvodi";
		for(var i=0;i<korpa.length;i++)
		{
			poruka+=";"+korpa[i].naziv;
		}
		
		var pomTabela=document.getElementById("izaberiNacinPlacanja");
		if(pomTabela.value=="kreditnoPlacanje")
		{
			poruka+="/"+ulogovanKorisnik.koisnickoIme+"/"+document.getElementById("brojRacuna").value+"/"+document.getElementById("tipRacuna").value+"/"+pomTabela.value;
		}
		else
		{
			poruka+="/"+ulogovanKorisnik.koisnickoIme+"/"+document.getElementById("imeBanke").value+"/"+document.getElementById("brojBanke").value+"/"+pomTabela.value;
		}
		
		posaljiPlacanjeDrugiNacin(poruka);
	}
	else
	{
		alert("Niste izabrali proizvode za kupovinu!");
	}
}


function registracijaPokazi()
{
	resetSve();
	document.getElementById("tabelaRegistracijaDeo").style.display="";
	document.getElementById("korisnickoIme").style.display="";
	document.getElementById("korisnickaSifra").style.display="";
	document.getElementById("korisnickaAdresa").style.display="";
	
	document.getElementById("pomoc").innerHTML="Sada imamo 3 textboxa i 2 dugmeta ( Ponisti i Registruj se )\n\n"+
	"u textboxovima korisnicko ime,korisnicka sifra i adresa trebaju da budu uneseni string podaci\n"+
	"a za korisnicko ime mora biti uneto ime koje vec nije zauzeto od strane nekog drugog korisnika\n"+
	"na primer u ovom slucaju ne bi smo trebali da unesemo ime Marko ili Milos ili admin\n"+
	"jer ako unesemo server ce nam vratiti poruku da korisnik sa datim imenom vec postoji u bazi\n\n"+
	"tako da mozemo uneti na primer korisnicko ime: Srki  , sifra: 123  , adresa: Beograd\n\n"+
	"kada unesemo podatke ako zelimo da se registrujemo kliknemo na dugme Registruj se\n\n"+
	"u slucaju da ne zelimo da se registrujemo kliknemo na dugme Ponisti i to ce nas vratiti na prethodnu stranu";
}

function pocetnoStanje()
{
	resetSve();
	document.getElementById("loginDeo").style.display="";
	document.getElementById("tabelaProizvodiDeo").style.display="";
	document.getElementById("pomoc").innerHTML="Na gornjoj desnoj strani imamo dva textboxa i dva dugmeta (Uloguj se i Registruj se)\n\n"+
	"za logovanje sam vec napravio par korisnika preko kojih se moze ulogovati\n\n"+
	"ako zelimo da se ulogujemo kao kupac korisnicko ime je: Milos   a sifra je: 123\n\n"+
	"ako zelimo da se ulogujemo kao prodavac korisnicko ime je: Marko   a sifra je: 123\n\n"+
	"ako zelimo da se ulogujemo kao administrator korisnicko ime je: admin  a sifra je: 123\n\n"+
	"kada smo uneli potrebne podatke za logovanje kliknemo na dugme Uloguj se\n\n"+
	"ali ako zelimo da napravimo novog korisnika kliknemo na dugme Registruj se";
}

function pocetniKupacPokazi()
{
	resetSve();
	document.getElementById("korpaDeo").style.display="";
	document.getElementById("tabelaProizvodiDeo").style.display="";
	document.getElementById("izlogujDeo").style.display="";
	document.getElementById("prikaziNarudzbineDugme").style.display="";
	korpa=new Array();
	document.getElementById("pomoc").innerHTML="Posto smo se ulogovali kao kupac u gornjem desnom uglu smo dobili par novih opcija\n"+
	"imamo 3 nova dugmeta ( Prikazi narudzbine , Izloguj se i Kasa )\n\n"+
	"a u tabeli proizvoda dobili smo novo dugme Dodaj\n"+
	"kada kliknemo na ovo dugme stavljamo do znanja da zelimo da kupimo neki proizvod i \n"+
	"vrednost broj proizvoda i ukupna cena u gornjem desnom uglu ce se uvecavati u zavisnosti kolko puta kliknemo na dugme Dodaj\n"+
	"kada zelimo da vidimo koje smo proizvode sve izabrali za kupovinu ili ako zelimo da izbacimo neki proizvod iz kupovine kliknemo na dugme Kasa u gornjem desnom uglu\n\n"+
	"ako zelimo da pogledamo koje smo sve kupovine do sada odradili kliknemo na dugme Prikazi narudzbine u gronjem desnom uglu\n\n"+
	"ako zelimo da se izlogujemo kliknemo na dugme Izloguj se";
}

function pocetniProdavacPokazi()
{
	resetSve();
	document.getElementById("izlogujDeo").style.display="";
	document.getElementById("tabelaProdavcevihProizvodaDeo").style.display="";
	document.getElementById("prikaziNarudzbineDugme").style.display="none";
	document.getElementById("pomoc").innerHTML="Posto smo se ulogovali kao prodavac u gornjem desnom uglu smo dobili novu opciju Izloguj se\n"+
	"tabela proizvoda ce se popuniti sa proizvodima koje ovaj prodavac poseduje\n\n"+
	"a u tabeli proizvoda dobili smo novo dugme Izmeni i Izbrisi\n"+
	"a ispod tabele proizvoda smo dobili novo dugme Dodaj proizod\n\n"+
	"ako zelimo da imenimo neki proivod kliknemo na dugme Izmeni\n\n"+
	"ako zelimo da izbrisemo neki proizvod kliknemo na dugme Izbrisi\n\n"+
	"ako prodavac zeli da doda novi proizvod u svoj repertoar kliknemo na dugme Dodaj proizvod\n\n"
	"ako zelimo da se izlogujemo kliknemo na dugme Izloguj se";
}

function pocetniAdministratorPokazi()
{
	document.getElementById("pomoc").innerHTML="Posto smo se ulogovali kao administrator u gornjem desnom uglu smo dobili novu opciju Izloguj se\n"+
	"umesto tabele proizvoda dobili smo novu tabelu korisnici koja je popunjena sa svim kupcima i prodavcima\n\n"+
	"u tabeli korisnici imamo dugme Izbrisi koje brise datog korisnika iz baze kada kliknemo na njega\n\n"+
	"ako zelimo da se izlogujemo kliknemo na dugme Izloguj se";
	resetSve();
	document.getElementById("tabelaKorisniciDeo").style.display="";
	document.getElementById("izlogujDeo").style.display="";
	document.getElementById("prikaziNarudzbineDugme").style.display="none";
}

function dodajProizvodPokazi()
{
	document.getElementById("pomoc").innerHTML="Posto smo se odlucili da kao prodavac da dodamo novi proizvod u svoje repertoar\n"+
	"dobili smo 3 textboxa u koje cemo uneti Naziv proizvoda, Opis proizvoda i Cena proizvoda\n\n"+
	"Naziv proizvoda i Opis proizvoda su tipa string dok je Cena proizvoda tipa int\n"+
	"Naziv proizvoda je unikatan i ne sme se poklopiti sa nekim vec postojecim Nazivom proizvoda ( u ovom slucaju bi mi bilo bolje da sam uneo novu promenljivu tipa serijski broj koja bi bila unikatna umesto naziva ... mozda promenim )\n"+
	"na primer za Naziv proizvoda mozemo uneti: Ferari\n"+
	"za Opis proizvoda mozemo uneti: brz auto\n"+
	"za Cenu proizvoda mozemo uneti: 150000  ( mozda mi ne bi bilo lose da sam ubacio jos neku promenljivu koja bi se zvala Valuta jer ovako se moze prodavati ili u dinarima ili u evrima....)\n\n"+
	"kada smo uneli potrebne podatke (Naziv proizvoda, Opis proizvoda i Cena proizvoda su obavezni ako zelimo da dodamo proizvod) kako bi smo dodali proizvod kliknemo na dugme Dodaj proizvod\n"+
	"kada smo kliknuli na Dodaj proizvod trebalo bi da se vratimo na prethodnu stranu i u tabeli bi trebao da se nalazi proizvod koji smo malopre uneli\n"+
	"ZA SLUCAJ DA SE NE NALAZI kliknimo na dugme Osvezi tabelu prodavcevih proizvoda i sa servera bi smo trebali da pokupimo sve prodavceve proizvode\n\n"+
	"dugme Ponisti nas vraca na prethodnu stranu\n\n"+
	"ako zelimo da se izlogujemo kliknemo na dugme Izloguj se";
	resetSve();
	menjanjePorizvodaPokazi();
	var pom=document.getElementById("nazivProizvoda");
	pom.disabled=false;
	
	document.getElementById("dodajProizvodDugme").style.display="";
	document.getElementById("izmeniProizvodDugme").style.display="none";
}

function izmeniProizvodPokazi()
{
	document.getElementById("pomoc").innerHTML="Posto smo se odlucili da kao prodavac da izmenimo neki proizvod\n"+
	"dobili smo 3 textboxa Naziv proizvoda, Opis proizvoda i Cena proizvoda\n\n"+
	"Naziv proizvoda i Opis proizvoda su tipa string dok je Cena proizvoda tipa int\n"+
	"Naziv proizvoda je zakljucan i njega ne mozemo da menjamo\n"+
	"za Opis proizvoda mozemo uneti: bilo sta\n"+
	"za Cenu proizvoda mozemo uneti: 1111111\n\n"+
	"kada smo uneli potrebne podatke (Opis proizvoda i Cena proizvoda su obavezni ako zelimo da dodamo proizvod) kako bi smo izmenili proizvod kliknemo na dugme Izmeni proizvod\n"+
	"kada smo kliknuli na Izmeni proizvod trebalo bi da se vratimo na prethodnu stranu i u tabeli bi trebao da se nalazi proizvod sa izmenjenim podacima\n"+
	"ZA SLUCAJ DA PODACI NISU IZMENJENI kliknimo na dugme Osvezi tabelu prodavcevih proizvoda i sa servera bi smo trebali da pokupimo sve prodavceve proizvode\n\n"+
	"dugme Ponisti nas vraca na prethodnu stranu\n\n"+
	"ako zelimo da se izlogujemo kliknemo na dugme Izloguj se";
	menjanjePorizvodaPokazi();
	var pom=document.getElementById("nazivProizvoda");
	pom.disabled=true;
	
	document.getElementById("dodajProizvodDugme").style.display="none";
	document.getElementById("izmeniProizvodDugme").style.display="";
}

function menjanjePorizvodaPokazi()
{
	document.getElementById("tabelaProdavcevihProizvodaDeo").style.display="none";
	document.getElementById("tabelaUnosProizvodaDeo").style.display="";
}

function kasaDeoPokazi()
{
	document.getElementById("pomoc").innerHTML="Kao kupac presli smo u deo kase gde mozemo da izbacimo proizvode iz kupovine ili da zavrsimo kupovinu\n"+
	"u tabeli proizvoda imamo dugme Izbaci , koje kada kliknemo izbacujemo dati proizvod iz kupovine\n\n"+
	"ispod tabele proizvoda imamo dugmad Vrati se nazad jos da kupujes koje kada kliknemo vraca nas na prethodnu stanu ali broj proizvoda i ukupna cena u gornjem desnom uglu ostaju isti\n\n"+
	"imamo i dugme Ponisti kupovinu koje kada kliknemo vraca na prethodnu stranu ali broj proizvoda i ukupna cena se stavljaju na nulu\n\n"+
	"trece dugme vidimo jedino ako imamo neke proizvode u tabeli i to dugme je Predji na zavrsavanje placanja\n"+
	"kada kliknemo na to dugme prebacuje nas na deo u kojem unosimo podatke sto se tice placanja\n\n"+
	"ako zelimo da se izlogujemo kliknemo na dugme Izloguj se";
	document.getElementById("korpaDeo").style.display="none";
	document.getElementById("tabelaProizvodiDeo").style.display="none";
	document.getElementById("tabelaKasaProizvodiDeo").style.display="";
	if(korpa!=null)
	{
		if(korpa.length>0)
			document.getElementById("zavrsnoPlacanjeDugme").style.display="";
		else
			document.getElementById("zavrsnoPlacanjeDugme").style.display="none";
	}
	else
		document.getElementById("zavrsnoPlacanjeDugme").style.display="none";
}

function zavrsnoPlacanjePokazi()
{
	document.getElementById("pomoc").innerHTML="Posto se kupac odlucio da zavrsi kupovinu treba izabrati nacin placanja i unteti potrebne podatke\n"+
	"kao prvo u selektboxu treba izabrati nacin placanja (Imamo izbor izmedju kreditnog i cekovnog placanja)\n\n"+
	"ako izaberemo kreditno treba da unesemo Broj racuna i Tip racuna u textboxu\n"+
	"ovi podaci su string i mozemo uneti sta god zelimo\n"+
	"na primer za Broje racuna mozemo uneti: AP107\n"+
	"a za Tip racuna mozemo na primer uneti: CKA3056\n"+
	"oba podatka su obavezna da se unesu\n\n"+
	"a ako smo izabrali cekovno placanje onda treba da unesemo Ime banke i Broj banke\n"+
	"ovi podaci su string i mozemo uneti sta god zelimo\n"+
	"na primer za Ime bank mozemo uneti: Raifiesen\n"+
	"a za Broj banke mozemo na primer uneti: MT74653\n"+
	"oba podatka su obavezna da se unesu\n\n"+
	"ako zelimo jos neke proizvode da dodamo u kupovinu treba da kliknemo na dugme Vrati se nazad jos da kupujes\n\n"+
	"a ako zelimo da prekinemo ovu kupovinu kliknemo na dugme Ponisti kupovinu i to ce staviti broj proizvoda i ukupnu cenu na nulu i vratice nas na pocetnu stranu\n\n"+
	"ako zelimo da zavrsimo kupovinu imamo izbor izmedju 2 dugmeta Zavrsi placanje i Zavrsi placanje na drugi nacin\n\n"+
	"ako kliknemo na dugme Zavrsi placanje to ce proslediti serveru izabrane proizvode za kupoivnu kao Json podatak\n"+
	"i serveru ostale podatke prosledjujemo na sledeci nacin:\n"+
	"/api/radProizvodi/kreditnoPlacanje/ulogovanKorisnikIme/brojRacuna/tipRacuna\n"+
	"a za cekovno placanje bi izgledalo ovako\n"+
	"/api/radProizvodi/cekovnoPlacanje/ulogovanKorisnikIme/imeBanke/brojBanke\n\n"+
	"dok ako kliknemo na dugme Zavrsi placanje na drugi nacin ce proslediti proizvode normalno to jest serveru na primer prosledjujemo ovako:\n"+
	"/api/radProizvodi/placanje/proizvodi;nazivProizvoda1;nazivProizvoda2;/ulogovanKorisnikIme/brojRacuna/tipRacuna/kreditnoPlacanje\n"+
	"a ako koristimo cekovno placanje prethodni primer bi izgledao ovako:\n"+
	"/api/radProizvodi/placanje/proizvodi;nazivProizvoda1;nazivProizvoda2;/ulogovanKorisnikIme/imeBanke/brojBanke/cekovnoPlacanje\n\n"+
	"kada kliknemo na bilo koje dugme Zavrsnog placanja to ce nas vratiti na pocetnu stranu kupca i na dugme Prikazi narudzbine mozemo da pogledamo sve kupovine koje smo obavili\n\n"+
	"kada kliknemo na to dugme prebacuje nas na deo u kojem unosimo podatke sto se tice placanja\n\n"+
	"ako zelimo da se izlogujemo kliknemo na dugme Izloguj se";
	
	document.getElementById("korpaDeo").style.display="none";
	document.getElementById("tabelaProizvodiDeo").style.display="none";
	document.getElementById("tabelaKasaProizvodiDeo").style.display="none";
	document.getElementById("cekovnoPlacanje").style.display="none";
	document.getElementById("tabelaZavrsiPlacanjeDeo").style.display="";
	document.getElementById("kreditnoPlacanje").style.display="";
	
	var pom=document.getElementById("imeBanke");
	pom.value="";
	pom=document.getElementById("brojBanke");
	pom.value="";
	pom=document.getElementById("brojRacuna");
	pom.value="";
	pom=document.getElementById("tipRacuna");
	pom.value="";
}

function vratiNaKupcaPokazi()
{
	document.getElementById("korpaDeo").style.display="";
	document.getElementById("tabelaProizvodiDeo").style.display="";
	document.getElementById("tabelaKasaProizvodiDeo").style.display="none";
	document.getElementById("tabelaZavrsiPlacanjeDeo").style.display="none";
	document.getElementById("tabelaPlacanjaDeo").style.display="none";
	
	var pom=document.getElementById("ukupnaCenaKorpa");
	pom.innerHTML = sracunajUkupnuCenu();
	pom=document.getElementById("brojProizvodaKorpa");
	pom.innerHTML = korpa.length;
	document.getElementById("pomoc").innerHTML="Posto smo se ulogovali kao kupac u gornjem desnom uglu smo dobili par novih opcija\n"+
	"imamo 3 nova dugmeta ( Prikazi narudzbine , Izloguj se i Kasa )\n\n"+
	"a u tabeli proizvoda dobili smo novo dugme Dodaj\n"+
	"kada kliknemo na ovo dugme stavljamo do znanja da zelimo da kupimo neki proizvod i \n"+
	"vrednost broj proizvoda i ukupna cena u gornjem desnom uglu ce se uvecavati u zavisnosti kolko puta kliknemo na dugme Dodaj\n"+
	"kada zelimo da vidimo koje smo proizvode sve izabrali za kupovinu ili ako zelimo da izbacimo neki proizvod iz kupovine kliknemo na dugme Kasa u gornjem desnom uglu\n\n"+
	"ako zelimo da pogledamo koje smo sve kupovine do sada odradili kliknemo na dugme Prikazi narudzbine u gronjem desnom uglu\n\n"+
	"ako zelimo da se izlogujemo kliknemo na dugme Izloguj se";
}

function izlogujPokazi()
{
	pocetnoStanje();
	korpa=new Array();
	pom=document.getElementById("brojProizvodaKorpa");
	pom.innerHTML="0";
	pom=document.getElementById("ukupnaCenaKorpa");
	pom.innerHTML="0";
	if(ulogovanKorisnik!=null && ulogovanKorisnik.poruka=="Kupac")
	{
		var tabela=document.getElementById("tabelaProizvodi");
		var th=tabela.getElementsByTagName("th");
		th[th.length-1].style.display="none";
	}
	ulogovanKorisnik=null;
	var poruka="/api/radProizvodi/vratiProdavacProizvode";
	var dobio;
	var xhr = new XMLHttpRequest();
	xhr.onreadystatechange = function() {
		    if (xhr.readyState == 4) {
		      	dobio=JSON.parse( xhr.responseText );
		      	popuniTableuProizvoda(dobio);
		    }
	}
	xhr.open('GET', poruka, true);
	xhr.send();
}

function resetSve()
{
	var pom=document.getElementById("korpaDeo");
	pom.style.display="none";
	pom=document.getElementById("loginDeo");
	pom.style.display="none";
	pom=document.getElementById("korisnickoImeLog");
	pom.value="";
	pom=document.getElementById("sifraLog");
	pom.value="";
	pom=document.getElementById("imeBanke");
	pom.value="";
	pom=document.getElementById("brojBanke");
	pom.value="";
	pom=document.getElementById("brojRacuna");
	pom.value="";
	pom=document.getElementById("tipRacuna");
	pom.value="";
	pom=document.getElementById("nazivProizvoda");
	pom.value="";
	pom=document.getElementById("opisProizvoda");
	pom.value="";
	pom=document.getElementById("cenaProizvoda");
	pom.value="";
	pom=document.getElementById("korisnickoIme");
	pom.value="";
	pom=document.getElementById("korisnickaSifra");
	pom.value="";
	pom=document.getElementById("korisnickaAdresa");
	pom.value="";
	
	pom=document.getElementById("brojProizvodaKorpa");
	pom.innerHTML="0";
	pom=document.getElementById("ukupnaCenaKorpa");
	pom.innerHTML="0";
	
	document.getElementById("izlogujDeo").style.display="none";
	document.getElementById("tabelaProizvodiDeo").style.display="none";
	document.getElementById("tabelaProdavcevihProizvodaDeo").style.display="none";
	document.getElementById("tabelaKorisniciDeo").style.display="none";
	document.getElementById("tabelaKasaProizvodiDeo").style.display="none";
	document.getElementById("tabelaZavrsiPlacanjeDeo").style.display="none";
	document.getElementById("tabelaUnosProizvodaDeo").style.display="none";
	document.getElementById("tabelaRegistracijaDeo").style.display="none";
	document.getElementById("tabelaPlacanjaDeo").style.display="none";
}

function prikaziNarudzbine()
{
	document.getElementById("korpaDeo").style.display="none";
	document.getElementById("tabelaProizvodiDeo").style.display="none";
	document.getElementById("tabelaKasaProizvodiDeo").style.display="none";
	document.getElementById("tabelaZavrsiPlacanjeDeo").style.display="none";
	popuniTabeluNarudzbina();
	document.getElementById("pomoc").innerHTML="Posto smo kao kupac izabrali da pogledamo sva placanja koja smo obavili\n"+
	"imamo tabelu u kojoj su prikazani datumi kada smo obavili svaku kupovinu i u toj tabeli se nalaze dugmad Prikazi placanje\n\n"+
	"kada kliknemo na dugme Prikazi placanje otvorice se jos 2 tabele , jedna tabela bi trebala da prikaze kakvo je placanje bilo (cekovno ili kreditno) i podatke vezane za taj tip placanja\n"+
	"a druga tabela bi treba da prikaze sve proizvode koje smo kupili za izabranu kupovinu\n\n"+
	"ako zelimo da se izlogujemo kliknemo na dugme Izloguj se";
}

function popuniTabeluNarudzbina()
{
	var tabela=document.getElementById("tabelaNarudzbina");
	
	document.getElementById("tabelaPlacanjaDeo").style.display="";
	document.getElementById("tabelaKreditnoPlacanje").style.display="none";
	document.getElementById("tabelaCekovnoPlacanje").style.display="none";
	document.getElementById("tabelaPlacenihProizvoda").style.display="none";
	
	isprazniTabelu(tabela);
	
	if(ulogovanKorisnik!=null && ulogovanKorisnik.poruka=="Kupac")
	{
		var poruka="/api/rad/vratiNarudzbineKupca/"+ulogovanKorisnik.koisnickoIme;
		var dobio;
		document.getElementById("leviJson").innerHTML=poruka;
		var xhr = new XMLHttpRequest();
		xhr.onreadystatechange = function() {
			document.getElementById("desniJson").innerHTML=xhr.responseText;    
			if (xhr.readyState == 4) {
			      	dobio=JSON.parse( xhr.responseText );
			      	
			      	if(dobio!=null)
					{
						if(dobio.narudzbina.length==null)
							ubaciKupacNarudzbina(tabela,dobio.narudzbina,0);
						else
						{
							for(var i=0;i<dobio.narudzbina.length;i++)
								ubaciKupacNarudzbina(tabela,dobio.narudzbina[i],i);
						}
					}
			      	
			      	/*if(ulogovanKorisnik.narudzbina!=null)
					{
						if(ulogovanKorisnik.narudzbina.length==null)
							ubaciKupacNarudzbina(tabela,ulogovanKorisnik.narudzbina,0);
						else
						{
							for(var i=0;i<ulogovanKorisnik.narudzbina.length;i++)
								ubaciKupacNarudzbina(tabela,ulogovanKorisnik.narudzbina[i],i);
						}
					}*/
			      	
			    }
		}
		xhr.open('GET', poruka, true);
		xhr.send();
	}
}

function ubaciKupacNarudzbina(tabela,narudzbina,i)
{
	var red=tabela.insertRow();
	var cell1 = red.insertCell(0);
	cell1.innerHTML = narudzbina.datum;
	
	cell1 = red.insertCell(1);
	var btn=document.createElement("BUTTON");
	btn.red=i;
	btn.datum=narudzbina.datum;
	btn.proizvodi=narudzbina.proizvodiNarudzbina;
	btn.onclick=prikaziPlacanje;
	var t=document.createTextNode("Prikazi placanje");
	btn.appendChild(t); 
	cell1.appendChild(btn);
	
	if(i%2==0)
		red.className="alt";
}

function prikaziPlacanje()
{
	if(ulogovanKorisnik!=null && ulogovanKorisnik.poruka=="Kupac")
	{
		if(this.proizvodi!=null)
		{
			popuniNarudzbinaProizvoda(this);
			/*
			if(this.proizvodi.length==null)
				popuniNarudzbinaProizvoda(this.proizvodi.proizvodiNarudzbina,this);
			else(this.proizvodi.length>this.red)
				popuniNarudzbinaProizvoda(ulogovanKorisnik.narudzbina[this.red].proizvodiNarudzbina,this);*/	
		}
	}
}

function popuniNarudzbinaProizvoda(dugme)
{
	var tabela=document.getElementById("tabelaPlacenihProizvoda");
	tabela.style.display="";
	isprazniTabelu(tabela);
	
	if(dugme.proizvodi!=null)
	{
		if(dugme.proizvodi.length==null)
			ubaciProizvod(tabela,dugme.proizvodi,0);
		else
		{
			for(var i=0;i<dugme.proizvodi.length;i++)
				ubaciProizvod(tabela,dugme.proizvodi[i],i);
		}
	}
	popuniNarudzbinaNacinPlacanja(dugme.datum);
}

function popuniNarudzbinaNacinPlacanja(datum)
{
	var poruka="/api/rad/vratiNarudzbinaNacinPlacanja/"+ulogovanKorisnik.koisnickoIme+"/"+datum;
	var dobio;
	document.getElementById("leviJson").innerHTML=poruka;
	var xhr = new XMLHttpRequest();
	xhr.onreadystatechange = function() {
		document.getElementById("desniJson").innerHTML=xhr.responseText;    
		if (xhr.readyState == 4) {
		      	dobio=JSON.parse( xhr.responseText );
		      	popuniNacinPlacanja(dobio);
		    }
	}
	xhr.open('GET', poruka, true);
	xhr.send();
}

function popuniNacinPlacanja(dobio)
{
	var tabela;
	
	if(dobio.bankinId!=null)
	{
		document.getElementById("tabelaKreditnoPlacanje").style.display="none";
		tabela=document.getElementById("tabelaCekovnoPlacanje");
		tabela.style.display="";
		
		isprazniTabelu(tabela);
		
		var red=tabela.insertRow();
		var cell1 = red.insertCell(0);
		cell1.innerHTML = dobio.ime;
		
		cell1 = red.insertCell(1);
		cell1.innerHTML = dobio.bankinId;
		
	}
	else
	{
		document.getElementById("tabelaCekovnoPlacanje").style.display="none";
		tabela=document.getElementById("tabelaKreditnoPlacanje");
		tabela.style.display="";
		
		isprazniTabelu(tabela);
		
		var red=tabela.insertRow();
		var cell1 = red.insertCell(0);
		cell1.innerHTML = dobio.broj;
		
		cell1 = red.insertCell(1);
		cell1.innerHTML = dobio.tip;
		
		cell1 = red.insertCell(2);
		cell1.innerHTML = dobio.danIsticanja;
	}
}

function prikaziDiagram1()
{
	if(document.getElementById("diagram1").style.display=="none")
		document.getElementById("diagram1").style.display="";
	else
		document.getElementById("diagram1").style.display="none";
}

function prikaziDiagram2()
{
	if(document.getElementById("diagram2").style.display=="none")
		document.getElementById("diagram2").style.display="";
	else
		document.getElementById("diagram2").style.display="none";
}
</script>

</head>


<body>
<div class="banner">

	<div class="logo">
		<br>
		<font size="100" color="red">Prodavnica.appspot</font>
	</div>
	
	<div class="korpa" id="korpaDeo">
		<table style="left:10%;" border="1">
			<tr>
				<td rowspan="4"><img src="img/index.jpg" alt="Korpa" height="42" width="42"/></td>
				<td rowspan="4">Broj proizovoda:<label id="brojProizvodaKorpa">0</label>;
				<br>
				Ukupna cena:<label id="ukupnaCenaKorpa">0</label>;
				</td>
				<td rowspan="4"><button type="button" id="prikaziKupljeneProizvode" onclick="popuniTableuKorpeProizvoda()">Kasa</button></td>
			</tr>
		</table>
	</div>
	
	<div style="float:right;" id="izlogujDeo">
		<br>
		<button type="button" onclick="prikaziNarudzbine()" id="prikaziNarudzbineDugme">Prikazi narudzbine</button>
		<br><br>
		<button type="button" onclick="izlogujPokazi()">Izloguj se</button>
	</div>
	
	<div class="login" id="loginDeo">
		<table style="left:10%;">
			<tr>
				<td>Korisnicko ime:</td>
				<td><input type="text" size="10%" maxlength="20" id="korisnickoImeLog"></input></td>
			</tr>
			<tr>
				<td>Sifra:</td>
				<td><input type="password" size="10%" maxlength="20" id="sifraLog"></input></td>
			</tr>
			<tr></tr>
			<tr>
				<td><button type="button" onclick="logIn()">Uloguj se</button></td>
				<td><button type="button" onclick="registracijaPokazi()">Registruj se</button></td>
			</tr>
		</table>
	</div>

</div>
<br>
<div style="float:left;position:absolute;">
	<div style="position:absolute;">
			<font size="200" color="red">Uputstvo</font>
	</div>
	<br><br><br>
	<textarea id="pomoc" rows="20" cols="30"  readonly></textarea>
</div>

<div style="position:relative;left:30%;">
	<span><img id="diagram1" src="img/Prodavnica1.jpg" alt="Diagram1" style="display:none;"/></span>
	<span><img id="diagram2" src="img/ProdavnicaUseCase1.jpg" alt="Diagram2" style="display:none;"/></span>
</div>

<div id="tabelaProizvodiDeo">
	<div style="position:absolute;left:40%;">
			<font size="200" color="red">Proizvodi</font>
	</div>
	<br><br><br>
	<div class="scrollovanje">
		<table id="tabelaProizvodi" class="proizvodi">
			<tr>
			  <th>Naziv</th>
			  <th>Opis</th>
			  <th>Cena</th>
			  <th style="display:none;">Dodaj</th>
			</tr>
		</table>
	</div>
	<br><br>
	<table class="unosPodataka">
		<tr>
			<td><button class="dugmeTabela" type="button" onclick="osvezi()">Osvezi tabelu</button></td>
		</tr>
	</table>
</div>

<div id="tabelaPlacanjaDeo">
	<div style="position:absolute;left:40%;">
		<font size="200" color="red">Tabela narudzbina</font>
	</div>
	<br><br><br>
	<div class="scrollovanje">
		<table id="tabelaNarudzbina" class="proizvodi">
			<tr>
			  <th>Datum</th>
			  <th>Prikazi placanje</th>
			</tr>
		</table>
	</div>
	<br><br><br>
	
	<div class="scrollovanje">
		<table id="tabelaKreditnoPlacanje" class="proizvodi">
			<tr>
				<th>Broj</th>
				<th>Tip</th>
				<th>Dan isticanja</th>
			</tr>
		</table>
	</div>
	
	<div class="scrollovanje">
		<table id="tabelaCekovnoPlacanje" class="proizvodi">
			<tr>
				<th>Ime</th>
				<th>Bankin Id</th>
			</tr>
		</table>
	</div>
	
	<br><br>
	<div class="scrollovanje">
		<table id="tabelaPlacenihProizvoda" class="proizvodi">
			<tr>
				<th>Naziv</th>
				<th>Opis</th>
				<th>Cena</th>
			</tr>
		</table>
	</div>
	
	<br><br>
	<table class="unosPodataka">
		<tr>
			<td><button class="dugmeTabela" type="button" onclick="vratiNaKupcaPokazi()">Nazad</button></td>
		</tr>
	</table>
</div>

<div id="tabelaProdavcevihProizvodaDeo">
	<div style="position:absolute;left:40%;">
			<font size="200" color="red">Proizvodi prodavac</font>
	</div>
	<br><br><br>
	<div class="scrollovanje">
		<table id="tabelaProdavcevihProizvoda" class="proizvodi">
			<tr>
			  <th>Naziv</th>
			  <th>Opis</th>
			  <th>Cena</th>
			  <th>Promeni</th>
			  <th>Izbrisi</th>
			</tr>
		</table>
	</div>
	<br>
	<table class="unosPodataka">
		<tr>
			<td><button class="dugmeTabela" type="button" onclick="osveziProdavceveProizvode()">Osvezi tabelu prodavcevih proizvoda</button></td>
			<td><button class="dugmeTabela" type="button" onclick="dodajProizvodPokazi()">Dodaj novi proizvod</button></td>
		</tr>
	</table>
</div>

<div id="tabelaKorisniciDeo"> 
	<div style="position:absolute;left:40%;">
			<font size="200" color="red">Korisnici</font>
	</div>
	<br><br><br>
	<div class="scrollovanje">
		<table id="tabelaKorisnici" class="proizvodi">
			<tr>
			  <th>Korisnicko ime</th>
			  <th>Adresa</th>
			  <th>Zanimanje</th>
			  <th>Izbrisi</th>
			</tr>
		</table>
	</div>
	<br>
	<table class="unosPodataka">
		<tr>
			<td><button class="dugmeTabela" type="button" onclick="vratiKorisnike()">Osvezi tabelu korisnika</button></td>
		</tr>
	</table>
</div>

<div id="tabelaKasaProizvodiDeo">
	<div style="position:absolute;left:40%;">
			<font size="200" color="red">Kasa</font>
	</div>
	<br><br><br>
	<div class="scrollovanje">
		<table id="tabelaKasaProizvoda" class="proizvodi">
			<tr>
			  <th>Naziv</th>
			  <th>Opis</th>
			  <th>Cena</th>
			  <th>Broj proizvoda</th>
			  <th>Ukupna cena proizvoda</th>
			  <th>Izbaci</th>
			</tr>
		</table>
	</div>
	<br>
	<table class="unosPodataka">
		<tr>
			<td><button class="dugmeTabela" type="button" onclick="vratiNaKupcaPokazi()">Vrati se nazad jos da kupujes</button></td>
			<td><button class="dugmeTabela" type="button" onclick="pocetniKupacPokazi()">Ponisti kupovinu</button></td>
			<td><button class="dugmeTabela" type="button" id="zavrsnoPlacanjeDugme" onclick="zavrsnoPlacanjePokazi()">Predji na zavrsavanje placanja</button></td>
		</tr>
	</table> 
</div>

<div id="tabelaZavrsiPlacanjeDeo">
	<div style="position:absolute;left:40%;">
			<font size="200" color="red">Zavrsno placanje</font>
	</div>
	<br><br><br>
	
	<table id="zavrsiPlacanje" border="0" class="unosPodaci">
		<tr>
			<td>Nacin placanja:</td>
			<td>
				<select id="izaberiNacinPlacanja" onchange="izaberiPlacanje()">
					<option value="kreditnoPlacanje">Kreditno placanje</option>
				  	<option value="cekovnoPlacanje">Cekovno placanje</option>
				</select> 
			</td>
		</tr>
	</table>
	<br>

	<table id="kreditnoPlacanje" border="0" class="unosPodaci">
		<tr>
			<td>Broj racuna:</td>
			<td><input type="text" id="brojRacuna"></input ></td>
		</tr>
		<tr>
			<td>Tip racuna:</td>
			<td><input type="text" id="tipRacuna"></input ></td>
		</tr>
	</table>


	<table id="cekovnoPlacanje" border="0" class="unosPodaci">
		<tr>
			<td>Ime banke:</td>
			<td><input type="text" id="imeBanke"></input ></td>
		</tr>
		<tr>
			<td>Broj banke:</td>
			<td><input type="text" id="brojBanke"></input ></td>
		</tr>
	</table>
	<br>
	<table class="unosPodataka">
		<tr>
			<td><button class="dugmeTabela" type="button" onclick="vratiNaKupcaPokazi()">Vrati se nazad jos da kupujes</button></td>
			<td><button class="dugmeTabela" type="button" onclick="pocetniKupacPokazi()">Ponisti kupovinu</button></td>
			<td><button class="dugmeTabela" type="button" onclick="zavrsiPlacanje()">Zavrsi placanje</button></td>
			<td><button class="dugmeTabela" type="button" onclick="zavrsiPlacanjeDrugiNacin()">Zavrsi placanje na drugi nacin</button></td>
		</tr>
	</table>
</div>

<div id="tabelaUnosProizvodaDeo">
	<div style="position:absolute;left:40%;">
	<font size="200" color="red" >Unos proizvoda</font>
	</div>
	<br><br><br>

	<table id="unosProizvoda" border="0" class="unosPodaci">
		<tr>
			<td>Naziv proizvoda:</td>
			<td><input type="text" maxlength="20" id="nazivProizvoda"></input ></td>
		</tr>
		<tr>
			<td>Opis proizvoda:</td>
			<td><textarea rows="4" maxlength="60" cols="50" id="opisProizvoda"></textarea> </td>
		</tr>
		<tr>
			<td>Cena proizvoda:</td>
			<td><input type="text" maxlength="20" id="cenaProizvoda"></input ></td>
		</tr>
	</table>
	<br>
	<table class="unosPodataka">
		<tr>
			<td><button class="dugmeTabela" type="button" onclick="pocetniProdavacPokazi()">Ponisti</button></td>
			<td><button class="dugmeTabela" type="button" id="dodajProizvodDugme" onclick="dodajProizvod()">Dodaj proizvod</button></td>
			<td><button class="dugmeTabela" type="button" id="izmeniProizvodDugme" onclick="promeniProizvodAkcija()">Promeni proizvod</button></td>
		</tr>
	</table>
</div>

<div id="tabelaRegistracijaDeo">
	<div style="position:absolute;left:40%;">
	<font size="200" color="red" >Registracija</font>
	</div>
	<br><br><br>

	<table id="registracija" class="unosPodataka">
		<tr>
			<td>Korisnicko ime:</td>
			<td><input type="text" id="korisnickoIme"></input ></td>
		</tr>
		<tr>
			<td>Korisnicka sifra:</td>
			<td><input type="text" id="korisnickaSifra"></input ></td>
		</tr>
		<tr>
			<td>Adresa:</td>
			<td><input type="text" id="korisnickaAdresa"></input ></td>
		</tr>
		<tr>
			<td>Registruj me kao:</td>
			<td>
				<select id="selekcija">
				  <option value="kupac">Kupca</option>
				  <option value="prodavac">Prodavca</option>
				</select> 
			</td>
		</tr>
	</table>
	<br>
	<br>
	<table class="unosPodataka">
		<tr>
			<td><button class="dugmeTabela" type="button" onclick="pocetnoStanje()">Ponisti</button></td>
			<td><button class="dugmeTabela" type="button" onclick="registracija()">Registruj se</button></td>
		</tr>
	</table>
</div>

<div class="jsonPodaci">
	<table border="0" style="left:0%;width:100%;heigth:100%;border-collapse:collapse;table-layout:fixed;">
		<tr>
			<td>Podaci koje saljemo serveru:&nbsp&nbsp&nbsp&nbsp<input type="checkbox" onclick="prikaziDiagram1()">Prikazi prvi diagram</td>
			<td>Podaci koje primamo od servera:&nbsp&nbsp&nbsp&nbsp<input type="checkbox" onclick="prikaziDiagram2()">Prikazi drugi diagram</td>
		</tr>
		<tr>
			<td><textarea rows="2" cols="75" id="leviJson" readonly></textarea> </td>
			<td><textarea rows="2" cols="75" id="desniJson" readonly></textarea> </td>
		</tr>
	</table>
</div>

</body>

</html>